<template>
  <!-- HTML结构：要求这里面有且只有一个根标签 -->
 <div>这是根标签
  <h2></h2>
  <!-- 插值表达式，也叫大胡子、小胡子语法 -->
  <!-- toUpperCase()小写转大写 -->
  <p>姓名：{{uname.toUpperCase()+'你好呀'}}</p>
  <p>年龄：{{age}}</p>
  <p>{{flag?'111':'222'}}</p>
  <!-- 标签的v-html属性，相当于innerHTML的意思，会覆盖原有的内容-->
  <p v-html='info'>简介：</p>
  <!-- 标签的v-text属性，相当于innerText的意思 -->
  <p v-text='age'>年龄：</p>
  </div> 
</template>

<script>
// JavaScript
export default{
  // 对象里面可以写很多东西，比如data、methods、computed、watch、components……
  // data用于存储数据:写法上要求data定义成函数,函数里面返回一个对象,所有有的数据都放到这个返回的对象中
  data(){
    return{
      uname:'lisisi',
      age:20,
      flag:true,
      info:'这是一个<strong>优秀</strong>的girl'
    }
  }
}
</script>

<style>
/* css样式 */
</style>
